<%--
  Created by IntelliJ IDEA.
  User: 陌·笙
  Date: 2018-12-30
  Time: 16:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>采购进货</title>
    <jsp:include page="/comm/tag.jsp"/>
    <script>
        $(function () {
            $("#mytable").bootstrapTable({
                url:"/shop/showShop",
                height:320,
                pageSize:4,
                pageNumber:1,
                pageList:[2,4],
                //启用分页，但是默认情况下，是客户端分页的
                pagination:true,
                sidePagination:'server',
                queryParams:function(params){
                    var temp = {  //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                        limit: params.limit,  //页面大小
                        offset: params.offset, //页码
                        repertoryName:$("[name='repertoryName']").val(),
                        typeId:$("[name='typeId']").val(),
                        firmId:$("[name='firmId']").val(),
                    };
                    return temp;
                },
                locale:'zh-CN',//中文支持,
                toolbar:'#top',
                columns:[
                    {field:"shopid",title:"商品编号",align:"center"},
                    {field:"shopName",title:"商品名称",align:"center"},
                    {field:"shopType",title:"手机型号",align:"center"},
                    {field:"type.iptypeName",title:"手机类别",align:"center"},
                    {field:"shopprice",title:"价钱",align:"center"},
                    {field:"shopcolor",title:"商品颜色",align:"center"},
                    {field:"firm.firmName",title:"生产厂商",align:"center"},
                    {
                        title:"操作",
                        align:"center",
                        formatter:function(value,row,index){
                            return " <button class=\"btn btn-danger\" onclick=\"show('"+index+"')\" > <span class=\"glyphicon glyphicon-plus\"></span>&nbsp;&nbsp;添加</button>&nbsp;&nbsp;&nbsp;"
                        }
                    },
                ]
            });
            $.ajax({
                url:"/role/showfirm",
                type:"get",
                success:function(data){
                    $.each(data,function(){
                        var adds=$("<option value='"+this.firmId+"'>"+this.firmName+"</option>");
                        $(".s").append(adds);
                    });
                }
            });

            $.ajax({
                type:"post",
                url:"/shop/stockSum",
                success:function(data){
                    if(data.sums==undefined){
                        $(".totals").html(0.0);
                        $(".nums").html(0);
                    }else{
                        $(".totals").html(data.sums);
                        $(".nums").html(data.num);
                    }
                }
            })

            $.ajax({
                url:"/type/showType",
                type:"get",
                success:function(data){
                    $.each(data,function(){
                        var adds=$("<option value='"+this.iptypeid+"'>"+this.iptypeName+"</option>");
                        $(".k").append(adds);
                    });
                }
            });
        })
        function  cha(){//查询
            var opts = $("#mytable").bootstrapTable("getOptions") ;
            var shopName=$("[name='shopName']").val();
            var typeId=$("[name='typeId']").val();
            var firmId=$("[name='firmId']").val();
            var limit = opts.pageSize ;
            var offset = (opts.pageNumber-1) * limit;
            $.ajax({
                url:"/shop/showShop",
                type:"get",
                data:{"shopName":shopName,"typeId":typeId,'firmId':firmId,'limit':limit,'offset':offset},
                success:function(data){
                    $("#mytable").bootstrapTable("load",data);
                }
            })
        }
        $(function(){
            $("#xiaoshou").bootstrapTable({
                url:"/shop/showStock?staticStock=1",
                height:300,
                pageSize:4,
                pageNumber:1,
                pageList:[2,3,4],
                //启用分页，但是默认情况下，是客户端分页的
                pagination:true,
                sidePagination:'server',
                queryParams:function(params){
                    var temp = {  //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                        limit: params.limit,  //页面大小
                        offset: params.offset, //页码
                    };
                    return temp;
                },
                locale:'zh-CN',//中文支持,
                toolbar:'#top',
                columns:[
                    {field:"shop.shopid",title:"商品编号",align:"center"},
                    {field:"shop.shopName",title:"商品名称",align:"center"},
                    {field:"shop.shopType",title:"手机型号",align:"center"},
                    {field:"shop.shopprice",title:"价钱",align:"center"},
                    {field:"stockNum",title:"商品数量",align:"center"},
                    {field:"shop.shopcolor",title:"商品颜色",align:"center"},
                    {field:"stockTotal",title:"总金额",align:"center"},
                    {
                        title:"操作",
                        align:"center",
                        formatter:function(value,row,index){
                            return " <button class=\"btn btn-danger\" onclick=\"del('"+row.stockid+"',1)\" > <span class=\"glyphicon glyphicon-trash\"></span>&nbsp;&nbsp;删除</button>"
                        }
                    },
                ]
            });
        })
        function show(index){
            if($("[name='tableId']").val()!=null && $("[name='tableId']").val()!=""){
                $("#mytable").bootstrapTable("uncheck",$("[name='tableId']").val());//取消选中
            }
            $("#mytable").bootstrapTable("check",index);//根据索引让该行选中
            var a=$("#mytable").bootstrapTable("getSelections")[0];
            $("#shopName").html(a.shopName);
            $("#shopType").html(a.shopType);
            $("#shopcolor").html(a.shopcolor);
            $("[name='shopId']").val(a.shopid);
            $("[name='shopprice']").val(a.shopprice);
            $("[name='tableId']").val(index);
            $("#myModal").modal('show');
        }
        $(function () {//修改框
            $(".closes").on("click",function () {
                //关闭对话框
                $("#myModal").modal('hide');
                //清空表单
                $('#myform')[0].reset();
                //清空表单
                $("#mytable").bootstrapTable("uncheck",$("[name='tableId']").val());//取消选中
            })
        });
    </script>
    <script>
        $(function () {
            $("#jinhuo_table").bootstrapTable({
                url:"/shop/showStock?staticStock=2",
                height:730,
                pageSize:12,
                pageNumber:1,
                pageList:[6,10,12],
                //启用分页，但是默认情况下，是客户端分页的
                pagination:true,
                sidePagination:'server',
                queryParams:function(params){
                    var temp = {  //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                        limit: params.limit,  //页面大小
                        offset: params.offset, //页码
                    };
                    return temp;
                },
                locale:'zh-CN',//中文支持,
                toolbar:'#top',
                columns:[
                    {field:"shop.shopid",title:"商品编号",align:"center"},
                    {field:"shop.shopName",title:"商品名称",align:"center"},
                    {field:"shop.shopType",title:"手机型号",align:"center"},
                    {field:"shop.shopprice",title:"价钱",align:"center"},
                    {field:"stockNum",title:"商品数量",align:"center"},
                    {field:"shop.shopcolor",title:"商品颜色",align:"center"},
                    {field:"firm.firmName",title:"供货商",align:"center"},
                    {field:"stockTotal",title:"总金额",align:"center"},
                    {
                        title:"操作",
                        align:"center",
                        formatter:function(value,row,index){
                            return " <button class=\"btn btn-danger\" onclick=\"del('"+row.stockid+"',2)\" > <span class=\"glyphicon glyphicon-trash\"></span>&nbsp;&nbsp;删除</button>"
                        }
                    },
                ]
            })
        })
        function del(stockid,stateStock){
            var limit;
            var offset;
            if(stateStock==1){
                var opts = $("#xiaoshou").bootstrapTable("getOptions") ;
                limit = opts.pageSize ;
                offset = (opts.pageNumber-1) * limit;
            }else if(stateStock==2){
                var opts = $("#jinhuo_table").bootstrapTable("getOptions") ;
                 limit = opts.pageSize ;
                offset = (opts.pageNumber-1) * limit;
            }
            $.ajax({
                type:"post",
                url:"/shop/delstockId",
                data:{"stockId":stockid,"staticStock":stateStock,"offset":offset,"limit":limit},
                success:function(data){
                    if(stateStock==1){
                        $("#xiaoshou").bootstrapTable("load", data);
                    }else if(stateStock==2){
                        $("#jinhuo_table").bootstrapTable("load", data);
                        $.ajax({
                            type:"post",
                            url:"/shop/stockSum",
                            success:function(data){
                                if(data.sums==undefined){
                                    $(".totals").html(0.0);
                                    $(".nums").html(0);
                                }else{
                                    $(".totals").html(data.sums);
                                    $(".nums").html(data.num);
                                }
                            }
                        })
                    }
                }
            })
        }
    </script>
    <script>
        $(function(){
            $('#okform').bootstrapValidator({
                message: 'This value is not valid',
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    price: {
                        message: 'The username is not valid',
                        validators: {
                            notEmpty: {
                                message: '实付金额不能为空'
                            },
                            digits: {message: '该值只能包含数字。'},
                        },
                    }
                }
            })
        })
        function  submits(){
            $("[name='num']").val($(".nums").html());
            $("[name='total']").val($(".totals").html());
            $('#okform').data('bootstrapValidator').validate();
            //验证是否通过true/false
            var flag = $('#okform').data('bootstrapValidator').isValid();
            if(flag) {
                var formStr = $('#okform').serialize();
                //处理表单控件的中文乱码
                jinhuo = decodeURIComponent(formStr, true);
                $.ajax({
                    url:"/shop/wancheng",
                    type:"post",
                    data:jinhuo,
                    success:function(data){
                        $("#jinhuo_table").bootstrapTable("load",data);
                                $.ajax({
                                    type:"post",
                                    url:"/shop/stockSum",
                                    success:function(data){
                                        $(".totals").html(data.sums);
                                        $(".nums").html(data.num);
                                    }
                                })
                            }
                })
            }
        }
    </script>
</head>
<body>
<div style="margin-left: 50px;margin-right: 50px">
    <div class="#top" style="margin-top: 50px">
        <div class="col-md-12">
            <form action="" method="post" role="form" id="okform" class="form-horizontal">
                <div class="form-group col-md-3">
                    <a class="btn btn-primary" data-toggle="modal" href="#modal-id"><span class="glyphicon glyphicon-plus"></span>&nbsp;&nbsp;添加老商品</a>
                    <a class="btn btn-primary" data-toggle="modal" href="#newmodal"><span class="glyphicon glyphicon-plus"></span>&nbsp;&nbsp;添加新商品</a>
                    <a href="/kucun/fileDownloadDatas" class="btn btn-primary"><span class="glyphicon glyphicon-save"></span>&nbsp;&nbsp;导出</a>
                </div>
                <div class="form-group col-md-4">
                    <label for="" style="color: red;font-size: 20px" class="col-lg-7">应付金额:￥<span style="color: red;font-size: 20px" class="totals">0</span></label>
                    <label for="" style="color: blue;font-size: 20px" class="col-lg-5">总数量:<span class="nums" style="color: blue;font-size: 20px">0</span></label>
                </div>
                <div class="form-group col-md-5">
                    <label for="" style="color: red;font-size: 20px; text-align: right" class="col-lg-3">实付金额:</label>
                    <div class=" col-lg-3">
                        <input type="text" name="price" class="form-control" placeholder="" >
                        <input type="hidden" name="total" class="form-control" placeholder="" >
                        <input type="hidden" name="num" class="form-control" placeholder="" >
                    </div>
                    <label for="" style="color: red;font-size: 20px; text-align: right" class="col-lg-2">备注:</label>
                    <div class=" col-lg-4">
                        <input type="text" name="beizhu" class="form-control" placeholder="" >
                    </div>
                </div>
                <button type="button" class="btn btn-primary btn-info glyphicon glyphicon-save-file" onclick="submits()">保存</button>
            </form>
        </div><%--搜索框--%>
    </div><%--搜索框--%>

    <table id="jinhuo_table" class="table-striped"></table>
    <div class="modal fade" id="newmodal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body">
                    <form action="" method="post" role="form" id="newshop" class="form-horizontal">

                        <div class="form-group">
                            <label for="" class="col-md-3 control-label">商品名称:</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" name="shopName"  placeholder="请输入商品名称">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="" class="col-md-3 control-label">商品颜色:</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" name="shopColor"  placeholder="请输入商品颜色">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="" class="col-md-3 control-label">商品型号:</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" name="shopType"  placeholder="请输入商品型号">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="" class="col-md-3 control-label">商品类别:</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" name="typeName"  placeholder="请输入商品品牌">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="" class="col-md-3 control-label">生产厂商:</label>
                            <div class="col-md-9">
                                <select name="firmIds" class="form-control s">
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="" class="col-md-3 control-label">商品价钱:</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" name="shopPrice"  placeholder="请输入商品价钱">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="" class="col-md-3 control-label">商品数量:</label>
                            <div class="col-md-9">
                                <input type="number" class="form-control" name="stockNum" value="1">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" onclick="newsub()">保存</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
</div>
<div class="modal fade" id="modal-id" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 1200px">
        <div class="modal-content" style="width: 1200px">
            <div class="modal-body" style="width: 1200px">
                <div style="margin-left: 50px;margin-right: 50px">
                    <div class="#top" style="margin-top: 10px">
                        <div class="col-md-12">
                            <form action="" method="post" role="form" class="form-horizontal">
                                <div class="form-group col-md-4">
                                    <label for="" class="col-md-4 control-label">商品名称:</label>
                                    <div class="col-md-8">
                                        <input type="text" class="form-control" name="shopName" placeholder="可模糊查询">
                                    </div>
                                </div>

                                <div class="form-group col-md-4">
                                    <label for="" class="col-md-4 control-label">商品类别:</label>
                                    <div class="col-md-8">
                                        <select name="typeId" id="inputID" class="form-control k">
                                            <option value="0">全部</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group col-md-4">
                                    <label for="" class="col-md-4 control-label">厂商:</label>
                                    <div class="col-md-8">
                                        <select name="firmId" id="firm" class="form-control s">
                                            <option value="0">全部</option>
                                        </select>
                                    </div>
                                </div>
                                <button type="button" class="btn btn-primary btn-info glyphicon glyphicon-search" onclick="cha()">查询</button>
                            </form>
                        </div><%--搜索框--%>
                    </div><%--搜索框--%>
                    <table id="mytable" class="table-striped"></table>
                    <table id="xiaoshou" class="table-striped"></table>
                    <div class="modal inmodal" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content animated bounceInRight">
                                <div class="modal-header">
                                    </button>
                                    <i class="fa fa-laptop modal-icon"></i>
                                    <h4 class="modal-title">录入信息</h4>
                                    <small class="font-bold">进货商品录入信息</small>
                                </div>
                                <div class="modal-body">
                                    <form action="" method="post" role="form" id="myform" class="form-horizontal">
                                        <div class="form-group" style="font-size: 15px">
                                            <div class="col-md-4">
                                                <label for="">商品名称:</label>
                                                <label for="" id="shopName">oppoK1</label>
                                            </div>
                                            <div class="col-md-4">
                                                <label for="">商品型号:</label>
                                                <label for="" id="shopType">4G+128</label>
                                            </div>
                                            <div class="col-md-4">
                                                <label for="">商品颜色:</label>
                                                <label for="" id="shopcolor">黑色</label>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="col-md-2" style="text-align: center">数量:</label>
                                            <div class="col-md-10">
                                                <input type="number" name="stockNum" class="form-control" value="1">
                                                <input type="hidden" name="shopId" class="form-control">
                                                <input type="hidden" name="stockTotal" class="form-control">
                                                <input type="hidden" name="shopprice" class="form-control">
                                                <input type="hidden" name="tableId" class="form-control">
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-white closes">关闭</button>
                                    <button type="button" class="btn btn-primary" onclick="smt()">保存</button>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" id="quxiao" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" onclick="baocun()">保存</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script>
    function newsub(){
        //启用较验
        $('#newshop').data('bootstrapValidator').validate();
        //验证是否通过true/false
        var flag = $('#newshop').data('bootstrapValidator').isValid();
        if(flag){
            var formStr = $('#newshop').serialize();
            //处理表单控件的中文乱码
            stock = decodeURIComponent(formStr, true);
            $.ajax({
                type:"post",
                url:"/shop/newAddShop",
                data:stock,
                success:function(data){
                    $("#jinhuo_table").bootstrapTable("load",data);
                    var num= $("[name='stockNum']").val();
                    var price=$("[name='shopPrice']").val();
                    var to=$(".totals").html();
                    var total=(num*price).toFixed(2);
                    var totals=parseFloat(to)+parseFloat(total);
                    alert(typeof totals);
                    $(".totals").html(totals);
                    var sum=parseInt($(".nums").html())+parseInt(num);
                    $(".nums").html(sum);
                    $('#newshop')[0].reset();
                    $('#newshop').data('bootstrapValidator').resetForm();
                    $("#newmodal").modal('hide');
                }
            })
        }
    }
    $(function(){
        <!--校验框架-->
        $('#newshop').bootstrapValidator({
            message: 'This value is not valid',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                shopName: {
                    message: 'The username is not valid',
                    validators: {
                        notEmpty: {
                            message: '商品名称不能为空！'
                        },
                        stringLength: {
                            min: 2,
                            max: 7,
                            message: '必须是2-7个字符'
                        }
                    }
                },
                shopColor: {
                    message: 'The username is not valid',
                    validators: {
                        notEmpty: {
                            message: '商品颜色不能为空！'
                        },
                        stringLength: {
                            min: 2,
                            max: 7,
                            message: '必须是2-7个字符'
                        }
                    }
                },
                shopType: {
                    message: 'The username is not valid',
                    validators: {
                        notEmpty: {
                            message: '商品型号不能为空！'
                        },
                        stringLength: {
                            min: 2,
                            max: 7,
                            message: '必须是2-7个字符'
                        }
                    }
                },

                typeName: {
                    message: 'The username is not valid',
                    validators: {
                        notEmpty: {
                            message: '商品品牌不能为空！'
                        },
                        stringLength: {
                            min: 2,
                            max: 7,
                            message: '必须是2-7个字符'
                        }
                    }
                },
                shopPrice: {
                    message: 'The username is not valid',
                    validators: {
                        notEmpty: {
                            message: '价格不能为空'
                        },
                        numeric: {message: '该值只能包含数字。'},
                        greaterThan: {
                            value: 1,
                            message: '最小输入1'
                        },

                        lessThan: {
                            value: 100000,
                            message: '最大输入100000'
                        }
                    },
                },
                stockNum: {
                    message: 'The username is not valid',
                    validators: {
                        notEmpty: {
                            message: '数量不能为空'
                        },
                        digits: {message: '该值只能包含数字。'},
                        greaterThan: {
                            value: 1,
                            message: '最小输入1'
                        },

                        lessThan: {
                            value: 10000,
                            message: '最大输入10000'
                        }
                    },
                }
            }
        })
    })
</script>
<script>
    $(function () {
        $("#quxiao").on("click",function(){
            $.ajax({
                url:"/shop/delStateStock",
                type:"post",
                success:function(data){
                    $("#xiaoshou").bootstrapTable("load",data);
                }
            })
        })
    })
    function baocun(){
        $.ajax({
            url:"/shop/upStateStock",
            type:"post",
            success:function(data){
                $("#jinhuo_table").bootstrapTable("load",data);
                $.ajax({
                    url:"/shop/showStock",
                    data:{"staticStock":1,"offset":0,"limit":4},
                    type:"post",
                    success:function(data){
                        $("#xiaoshou").bootstrapTable("load",data);
                        $.ajax({
                            type:"post",
                            url:"/shop/stockSum",
                            success:function(data){
                                $(".totals").html(data.sums);
                                $(".nums").html(data.num);
                            }
                        })
                    }
                })
            }
        })
        $("#modal-id").modal('hide');
    }
    function smt(){
        var price=$("[name='shopprice']").val();
        var num=$("[name='stockNum']").val();
        var total=(price*num).toFixed(2);
        $("[name='stockTotal']").val(total);
        if (num>0) {
            //序列化表单
            var formStr = $('#myform').serialize();
            //处理表单控件的中文乱码
            stock = decodeURIComponent(formStr, true);
            var opts = $("#xiaoshou").bootstrapTable("getOptions");
            var limit = opts.pageSize;
            var offset = (opts.pageNumber - 1) * limit;
            $.ajax({
                url: "/shop/addStock",
                type: "post",
                data: stock,
                success: function (data) {
                    $("#xiaoshou").bootstrapTable("load", data);
                    $("#myModal").modal('hide');
                }
            })
        }else{
            swal({title:"错误!",text:"商品数量不能小于1件",type:"error"});
        }
    }
</script>
</body>
</html>
